
import './Tim.scss'
import '../../static/font/iconfont.css'
import { Form, Input, DatePicker, Select, Image, Modal } from 'antd';
import { ExclamationCircleOutlined } from '@ant-design/icons';
import shoukuan1 from '../../static/images/shoukuan1.png'
import shoukuan2 from '../../static/images/shoukuan2.png'
import { useEffect, useState } from 'react';
import http from '../../utils/http'
import store from '../../store/index'

const { Option } = Select;
const { confirm } = Modal;
const layout = {
    labelCol: {
        span: 6,
    },
    wrapperCol: {
        span: 14,
    },
};
const tailLayout = {
    wrapperCol: {
        offset: 8,
        span: 16,
    },
};
const TimCon = ({ setState }) => {
    //返回页面
    const [src, setSrc] = useState('')
    let tabledata = store.zengjiayu.timdetailid
    const [form1] = Form.useForm();
    const [form2] = Form.useForm();
    const [form3] = Form.useForm();
    useEffect(() => {
        // console.log(tabledata.key)
        http({
            url: '/peree_Comments/findContract_Table',
            method: 'post',
            params: {
                perId: tabledata.perId
            }
        }).then((res) => {
            console.log(res)
            if (res.code == 200) {
                let mydata1 = res.data.pereeContract[0]
                let mydata2 = res.data.pereeRoom[0]
                let mydata3 = res.data.collectionByPereeId[0]
                console.log(mydata1)
                form1.setFieldsValue({
                    contract_Serial: mydata1.contract_Serial,
                    contract_create_time: getLocalTime(mydata1.contract_create_time),
                    contract_end_time: getLocalTime(mydata1.contract_end_time),
                    per_name: mydata1.per_name,
                    per_type: mydata1.per_type == 0 ? '企业' : '个体经营户',
                    contract_type: mydata1.contract_type,
                    person_phone: mydata1.person_phone,
                    person_name: mydata1.person_name,
                })
                form2.setFieldsValue({
                    ten_Serialint: mydata2.ten_Serialint,
                    roomNo: mydata2.room_no,
                    roomArea: mydata2.room_area,
                    payArea: mydata2.pay_area,
                    propertyCostsArcher: mydata2.property_costs_archer,
                })
                form3.setFieldsValue({
                    collName: mydata3.collName,
                    collNum: mydata3.collNum,
                    coll_bank: mydata3.coll_bank,
                    credentials: mydata3.credentials,
                })
                setSrc(mydata3.credentials)
            }
        })
    }, [])
    const backCar = () => {
        setState(1)
    }
    const quxiao = () => {
        confirm({
            icon: <ExclamationCircleOutlined />,
            content: '您确定离开此页面吗？',
            cancelText: '取消',
            okText: '确定',
            onOk() {
                //   console.log('OK');
                backCar()
            },
            onCancel() {
                console.log('Cancel');
            },
        });
    }
    const [form] = Form.useForm();
    const onFinish = (values) => {
        console.log(values);
    };
    // 时间戳转换函数
    function getLocalTime(nS) {
        let date = new Date(nS);
        //时间戳为10位需*1000，时间戳为13位的话不需乘1000
        let y = date.getFullYear();
        let MM = date.getMonth() + 1;
        MM = MM < 10 ? "0" + MM : MM; //月补0
        let d = date.getDate();
        d = d < 10 ? "0" + d : d; //天补0
        // let h = date.getHours();
        // h = h < 10 ? "0" + h : h; //小时补0
        // let m = date.getMinutes();
        // m = m < 10 ? "0" + m : m; //分钟补0
        // let s = date.getSeconds();
        // s = s < 10 ? "0" + s : s; //秒补0
        // return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s;
        return y + "-" + MM + "-" + d;
    }
    return (
        <div className="xinzeng">

            <div className='content'>
                <div>
                    <p>合同基本信息:</p>
                    <Form {...layout} form={form1} name="control-hooks" onFinish={onFinish}>
                        <Form.Item
                            name="contract_Serial"
                            label="合同编号"
                            rules={[
                                {
                                    required: true,
                                },
                            ]}
                        >
                            <Input disabled />
                        </Form.Item>
                        <Form.Item
                            name="contract_create_time"
                            label="签订时间"
                            rules={[
                                {
                                    required: true,
                                },
                            ]}
                        >
                            <Input disabled />
                        </Form.Item>
                        <Form.Item
                            name="contract_end_time"
                            label="结束时间"
                            rules={[
                                {
                                    required: true,
                                },
                            ]}
                        >
                            <Input disabled />
                        </Form.Item>
                        <Form.Item
                            name="per_name"
                            label="租户名称"
                            rules={[
                                {
                                    required: true,
                                },
                            ]}
                        >
                            <Input disabled />
                        </Form.Item>
                        <Form.Item
                            name="per_type"
                            label="租户类型"
                            rules={[
                                {
                                    required: true,
                                },
                            ]}
                        >
                            <Select
                                placeholder=""
                                allowClear
                                disabled
                            >
                                <Select.Option value="企业">
                                    企业
                                </Select.Option>
                            </Select>
                        </Form.Item>
                        <Form.Item
                            name="contract_type"
                            label="合同属性"
                            rules={[
                                {
                                    required: true,
                                },
                            ]}
                        >
                            <Select
                                placeholder=""
                                allowClear
                                disabled
                            >
                                <Select.Option value="续约">
                                    续约
                                </Select.Option>
                            </Select>
                        </Form.Item>
                        <Form.Item
                            name="person_name"
                            label="签订人"
                            rules={[
                                {
                                    required: true,
                                },
                            ]}
                        >
                            <Input disabled />
                        </Form.Item>
                        <Form.Item
                            name="person_phone"
                            label="联系方式"
                            rules={[
                                {
                                    required: true,
                                },
                            ]}
                        >
                            <Input disabled />
                        </Form.Item>

                    </Form>
                </div>
                <div>
                    <p>租赁房间信息:</p>
                    <Form {...layout} form={form2} name="control-hooks2" onFinish={onFinish}>
                        <Form.Item
                            name="ten_Serialint"
                            label="所属楼宇"
                            rules={[{ required: true }]}
                        >
                            <Select disabled>
                                <Select.Option value="A1幢">
                                    A1幢
                                </Select.Option>
                                <Select.Option value="B2幢">
                                    B2幢
                                </Select.Option>
                                <Select.Option value="C3幢">
                                    C3幢
                                </Select.Option>
                            </Select>
                        </Form.Item>
                        <Form.Item
                            name="roomNo"
                            label="房间名称"
                            rules={[
                                {
                                    required: true,
                                },
                            ]}
                        >
                            <Input disabled />
                        </Form.Item>
                        <Form.Item
                            name="roomArea"
                            label="房间面积"
                            rules={[
                                {
                                    required: true,
                                },
                            ]}
                        >
                            <Input disabled />
                        </Form.Item>
                        <Form.Item
                            name="payArea"
                            label="计价面积"
                            rules={[
                                {
                                    required: true,
                                },
                            ]}
                        >
                            <Input disabled />
                        </Form.Item>
                        <Form.Item
                            name="propertyCostsArcher"
                            label="物业费用"
                            rules={[
                                {
                                    required: true,
                                },
                            ]}
                        >
                            <Input disabled />
                        </Form.Item>
                    </Form>
                </div>
                <div>
                    <p>收款信息:</p>
                    <Form {...layout} form={form3} name="control-hooks3" onFinish={onFinish}>

                        <Form.Item
                            name="collName"
                            label="开户名称"
                            rules={[
                                {
                                    required: true,
                                },
                            ]}
                        >
                            <Input disabled />
                        </Form.Item>
                        <Form.Item
                            name="coll_bank"
                            label="开户银行"
                            rules={[
                                {
                                    required: true,
                                },
                            ]}
                        >
                            <Input disabled />
                        </Form.Item>
                        <Form.Item
                            name="collNum"
                            label="银行卡号"
                            rules={[
                                {
                                    required: true,
                                },
                            ]}
                        >
                            <Input disabled />
                        </Form.Item>
                        <Form.Item
                            name="credentials"
                            label="收款凭证"
                            rules={[
                                {
                                    required: true,
                                },
                            ]}
                        >
                            <Image
                                width={200}
                                src={src}
                            />
                        </Form.Item>
                    </Form>
                </div>
            </div>
        </div>
    )
}
export default TimCon